home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2006 May / PCWMAY06.iso / Software / Freeware / First Page 2006 3.00 / fp2006-final-3.00-setup.exe / {app} / Iscripts / DHTML - Calenders / popup-calender.izs < prev    next >
Text File  |  2005-08-31  |  10KB  |  100 lines
  1. <!NOWIZARD>
  2.  
  3. <!TITLE>Popup Calendar
  4. <!/TITLE>
  5.  
  6. <!BROWSER>IE5+ Opr7+<!/BROWSER>
  7.  
  8. <!DESCRIPTION>Does your form contain INPUT box(es) that require a date value from the visitor? Sev's Popup Calendar script allows for a visual, interactive way of selecting and inputting this date, rendering the job of your visitor reaching for a physical calendar to find out the date (whether for today's or otherwise) obsolete. Very practical use of DHTML...
  9. <!/DESCRIPTION> 
  10.  
  11. <!CATEGORY>calenders<!/CATEGORY>
  12.  
  13. <!SCRIPT>
  14. <!-- START OF SCRIPT -->
  15. <!-- Step 1: Download the following zip file, and upload the containing "pupdate.js" file into your webpage directory:
  16. http://www.dynamicdrive.com/dynamicindex6/popcalendar.zip 
  17.  
  18. Step 2: Add the following code to the HEAD section of your webpage:
  19. -->
  20. <script language="JavaScript" src="pupdate.js">
  21.  
  22. /*
  23. Popup calendar script by Sev Kotchnev (webmaster@personal-connections.com)
  24. For full source code and installation instructions to this script
  25. Visit http://www.dynamicdrive.com
  26. */
  27.  
  28. </script>
  29. <!-- Step 3: Last but not least, apply the below to the END of your document, right above the </BODY> tag: -->
  30. <script language="JavaScript">
  31. if (document.all) {
  32.  document.writeln("<div id=\"PopUpCalendar\" style=\"position:absolute; left:0px; top:0px; z-index:7; width:200px; height:77px; overflow: visible; visibility: hidden; background-color: #FFFFFF; border: 1px none #000000\" onMouseOver=\"if(ppcTI){clearTimeout(ppcTI);ppcTI=false;}\" onMouseOut=\"ppcTI=setTimeout(\'hideCalendar()\',500)\">");
  33.  document.writeln("<div id=\"monthSelector\" style=\"position:absolute; left:0px; top:0px; z-index:9; width:181px; height:27px; overflow: visible; visibility:inherit\">");}
  34. else if (document.layers) {
  35.  document.writeln("<layer id=\"PopUpCalendar\" pagex=\"0\" pagey=\"0\" width=\"200\" height=\"200\" z-index=\"100\" visibility=\"hide\" bgcolor=\"#FFFFFF\" onMouseOver=\"if(ppcTI){clearTimeout(ppcTI);ppcTI=false;}\" onMouseOut=\"ppcTI=setTimeout('hideCalendar()',500)\">");
  36.  document.writeln("<layer id=\"monthSelector\" left=\"0\" top=\"0\" width=\"181\" height=\"27\" z-index=\"9\" visibility=\"inherit\">");}
  37. else {
  38.  document.writeln("<p><font color=\"#FF0000\"><b>Error ! The current browser is either too old or too modern (usind DOM document structure).</b></font></p>");}
  39. </script>
  40. <noscript><p><font color="#FF0000"><b>JavaScript is not activated !</b></font></p></noscript>
  41. <table border="1" cellspacing="1" cellpadding="2" width="200" bordercolorlight="#000000" bordercolordark="#000000" vspace="0" hspace="0"><form name="ppcMonthList"><tr><td align="center" bgcolor="#CCCCCC"><a href="javascript:moveMonth('Back')" onMouseOver="window.status=' ';return true;"><font face="Arial, Helvetica, sans-serif" size="2" color="#000000"><b>< </b></font></a><font face="MS Sans Serif, sans-serif" size="1"> 
  42. <select name="sItem" onMouseOut="if(ppcIE){window.event.cancelBubble = true;}" onChange="switchMonth(this.options[this.selectedIndex].value)" style="font-family: 'MS Sans Serif', sans-serif; font-size: 9pt"><option value="0" selected>2000 ò January</option><option value="1">2000 ò February</option><option value="2">2000 ò March</option><option value="3">2000 ò April</option><option value="4">2000 ò May</option><option value="5">2000 ò June</option><option value="6">2000 ò July</option><option value="7">2000 ò August</option><option value="8">2000 ò September</option><option value="9">2000 ò October</option><option value="10">2000 ò November</option><option value="11">2000 ò December</option><option value="0">2001 ò January</option></select></font><a href="javascript:moveMonth('Forward')" onMouseOver="window.status=' ';return true;"><font face="Arial, Helvetica, sans-serif" size="2" color="#000000"><b> ></b></font></a></td></tr></form></table>
  43. <table border="1" cellspacing="1" cellpadding="2" bordercolorlight="#000000" bordercolordark="#000000" width="200" vspace="0" hspace="0"><tr align="center" bgcolor="#CCCCCC"><td width="20" bgcolor="#FFFFCC"><b><font face="MS Sans Serif, sans-serif" size="1">Su</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Mo</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Tu</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">We</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Th</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Fr</font></b></td><td width="20" bgcolor="#FFFFCC"><b><font face="MS Sans Serif, sans-serif" size="1">Sa</font></b></td></tr></table>
  44. <script language="JavaScript">
  45. if (document.all) {
  46.  document.writeln("</div>");
  47.  document.writeln("<div id=\"monthDays\" style=\"position:absolute; left:0px; top:52px; z-index:8; width:200px; height:17px; overflow: visible; visibility:inherit; background-color: #FFFFFF; border: 1px none #000000\"> </div></div>");}
  48. else if (document.layers) {
  49.  document.writeln("</layer>");
  50.  document.writeln("<layer id=\"monthDays\" left=\"0\" top=\"52\" width=\"200\" height=\"17\" z-index=\"8\" bgcolor=\"#FFFFFF\" visibility=\"inherit\"> </layer></layer>");}
  51. else {/*NOP*/}
  52. </script>
  53. <!-- END OF SCRIPT -->
  54. <!/SCRIPT>
  55.  
  56. <!PREVIEW>
  57. <!-- START OF SCRIPT -->
  58.  
  59. <!-- Step 1: Download the following zip file, and upload the containing "pupdate.js" file into your webpage directory:
  60. http://www.dynamicdrive.com/dynamicindex6/popcalendar.zip 
  61.  
  62. Step 2: Add the following code to the HEAD section of your webpage:
  63. -->
  64. <script language="JavaScript" src="pupdate.js">
  65.  
  66. /*
  67. Popup calendar script by Sev Kotchnev (webmaster@personal-connections.com)
  68. For full source code and installation instructions to this script
  69. Visit http://www.dynamicdrive.com
  70. */
  71.  
  72. </script>
  73. <!-- Step 3: Last but not least, apply the below to the END of your document, right above the </BODY> tag: -->
  74. <script language="JavaScript">
  75. if (document.all) {
  76.  document.writeln("<div id=\"PopUpCalendar\" style=\"position:absolute; left:0px; top:0px; z-index:7; width:200px; height:77px; overflow: visible; visibility: hidden; background-color: #FFFFFF; border: 1px none #000000\" onMouseOver=\"if(ppcTI){clearTimeout(ppcTI);ppcTI=false;}\" onMouseOut=\"ppcTI=setTimeout(\'hideCalendar()\',500)\">");
  77.  document.writeln("<div id=\"monthSelector\" style=\"position:absolute; left:0px; top:0px; z-index:9; width:181px; height:27px; overflow: visible; visibility:inherit\">");}
  78. else if (document.layers) {
  79.  document.writeln("<layer id=\"PopUpCalendar\" pagex=\"0\" pagey=\"0\" width=\"200\" height=\"200\" z-index=\"100\" visibility=\"hide\" bgcolor=\"#FFFFFF\" onMouseOver=\"if(ppcTI){clearTimeout(ppcTI);ppcTI=false;}\" onMouseOut=\"ppcTI=setTimeout('hideCalendar()',500)\">");
  80.  document.writeln("<layer id=\"monthSelector\" left=\"0\" top=\"0\" width=\"181\" height=\"27\" z-index=\"9\" visibility=\"inherit\">");}
  81. else {
  82.  document.writeln("<p><font color=\"#FF0000\"><b>Error ! The current browser is either too old or too modern (usind DOM document structure).</b></font></p>");}
  83. </script>
  84. <noscript><p><font color="#FF0000"><b>JavaScript is not activated !</b></font></p></noscript>
  85. <table border="1" cellspacing="1" cellpadding="2" width="200" bordercolorlight="#000000" bordercolordark="#000000" vspace="0" hspace="0"><form name="ppcMonthList"><tr><td align="center" bgcolor="#CCCCCC"><a href="javascript:moveMonth('Back')" onMouseOver="window.status=' ';return true;"><font face="Arial, Helvetica, sans-serif" size="2" color="#000000"><b>< </b></font></a><font face="MS Sans Serif, sans-serif" size="1"> 
  86. <select name="sItem" onMouseOut="if(ppcIE){window.event.cancelBubble = true;}" onChange="switchMonth(this.options[this.selectedIndex].value)" style="font-family: 'MS Sans Serif', sans-serif; font-size: 9pt"><option value="0" selected>2000 ò January</option><option value="1">2000 ò February</option><option value="2">2000 ò March</option><option value="3">2000 ò April</option><option value="4">2000 ò May</option><option value="5">2000 ò June</option><option value="6">2000 ò July</option><option value="7">2000 ò August</option><option value="8">2000 ò September</option><option value="9">2000 ò October</option><option value="10">2000 ò November</option><option value="11">2000 ò December</option><option value="0">2001 ò January</option></select></font><a href="javascript:moveMonth('Forward')" onMouseOver="window.status=' ';return true;"><font face="Arial, Helvetica, sans-serif" size="2" color="#000000"><b> ></b></font></a></td></tr></form></table>
  87. <table border="1" cellspacing="1" cellpadding="2" bordercolorlight="#000000" bordercolordark="#000000" width="200" vspace="0" hspace="0"><tr align="center" bgcolor="#CCCCCC"><td width="20" bgcolor="#FFFFCC"><b><font face="MS Sans Serif, sans-serif" size="1">Su</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Mo</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Tu</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">We</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Th</font></b></td><td width="20"><b><font face="MS Sans Serif, sans-serif" size="1">Fr</font></b></td><td width="20" bgcolor="#FFFFCC"><b><font face="MS Sans Serif, sans-serif" size="1">Sa</font></b></td></tr></table>
  88. <script language="JavaScript">
  89. if (document.all) {
  90.  document.writeln("</div>");
  91.  document.writeln("<div id=\"monthDays\" style=\"position:absolute; left:0px; top:52px; z-index:8; width:200px; height:17px; overflow: visible; visibility:inherit; background-color: #FFFFFF; border: 1px none #000000\"> </div></div>");}
  92. else if (document.layers) {
  93.  document.writeln("</layer>");
  94.  document.writeln("<layer id=\"monthDays\" left=\"0\" top=\"52\" width=\"200\" height=\"17\" z-index=\"8\" bgcolor=\"#FFFFFF\" visibility=\"inherit\"> </layer></layer>");}
  95. else {/*NOP*/}
  96. </script>
  97. <!-- END OF SCRIPT -->
  98. <!/PREVIEW>
  99.  
  100. <!RELATED>NONE<!/RELATED>